<script setup lang="ts">
import Cookies from 'js-cookie'
import { info } from '@/api/security'
import { useUserStore } from './store/userStore';
import zhCN from 'ant-design-vue/es/locale/zh_CN';
import { message } from 'ant-design-vue';
import { theme } from 'ant-design-vue'
import { useGlobalStore } from './store/globalStore';
import { SysUser } from './interface/user';

const userStore = useUserStore()
const globalStore = useGlobalStore()

const initUserInfo = () => {
  if (Cookies.get('accessToken')) {
    info().then(res => {
      userStore.sysUser = res.data.data as SysUser
    })
  }
}

initUserInfo()
window.$message = message
</script>

<template>
  <a-config-provider :locale="zhCN" :theme="{
    algorithm: globalStore.darkMode === '0' ? theme.defaultAlgorithm : theme.darkAlgorithm,
    token: {
      colorPrimary: globalStore.themeColor
    }
  }">
    <RouterView />
  </a-config-provider>
</template>

<style lang="scss">
/* antd table滚动条 */
.ant-table-body {
  --sb-track-color: transparent;
  --sb-thumb-color: #8D8D8D;
  --sb-size: 7px;

  scrollbar-color: var(--sb-thumb-color) var(--sb-track-color);

  &::-webkit-scrollbar {
    width: var(--sb-size);
  }

  &::-webkit-scrollbar-track {
    background: var(--sb-track-color);
    border-radius: 10px;
  }

  &::-webkit-scrollbar-thumb {
    background: var(--sb-thumb-color);
    border-radius: 10px;
  }

  &::-webkit-scrollbar-thumb:hover {
    background: #69696A;
  }
}
</style>
